@import "color";
%boxSizing{
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
}
@mixin borderRadius($radius){
  border-radius : $radius;
  -webkit-border-radius : $radius;
  -moz-border-radius : $radius;
}
.pay{
  .load-error{
    font-size: 0.4em;
  }
   .address{
     position: relative;
     top: 0;
     left: 0;
     background: url("../images/tiao.png") no-repeat;
     background-color: white;
     background-size: contain;
     font-size: 0.8em;
     color: #333333;
     height : 60px;
     border-bottom : 1px solid #dddddd;
     padding: 10px 0;

    .goAddress{
      position: absolute;
      right: 5%;
      top: 50%;
      display: inline-block;
      width : 7px;
      height : 14px;
      margin-top: -7px;
      background-image : url("../images/right.png");
      background-size: cover;
    }

     div{
       height : 30px;
       padding-left: 5%;

       .icon{
         width : 15px;
         height : 15px;
         display: inline-block;
         margin-right : 3%;
       }
     }

     div:nth-child(1){
       height : 30px;
       line-height: 30px;
       //line-height: 400%;

       .icon{
         background: url("../images/ren.png") no-repeat;
         background-size: cover;
       }
     }

     div:nth-child(2){
       lheight : 30px;
       line-height: 30px;
       //line-height: 200%;

       .icon{
         background: url("../images/map.png") no-repeat;
         background-size: cover;
       }
     }
   }

  .pay-part{
    .part-head{
      padding: 0 3%;
      background-color: #fbfbfb;
      line-height : 40px;
      font-size: 0.94em;
      color: #333333;
    }
    //order info
    .order-goods{
      padding: 0 3%;
      border-top: 1px solid #dddddd;
      border-bottom: 1px solid #dddddd;
      background-color: white;
      li{
        padding-top : 10px;
        padding-bottom : 10px;
        border-bottom: 1px solid #dddddd;
        @extend %boxSizing;
        overflow: hidden;
        .info-left{
          width: 70%;
          float: left;
          overflow: hidden;
          .goods-img{
            float: left;
            max-width: 78.5px;
            height: 55px;
            font-size: 0.32em;
            overflow: hidden;
          }
          .goods-name-spec{
            width: 146px;
            padding-left: 10px;
            float: left;
            @extend %boxSizing;
            .goods-name{
              line-height : 33px;
              color: #333333;
              font-size: 1em;

              img{
                width:30%;
              }
            }
            .goods-spec{
              color: #999999;
              font-size: 0.752em;
              span{
                color: #333333;
              }
            }
          }
        }
        .info-right{
          width: 75px;
          text-align: right;
          float: right;
          .goods-price{
            line-height: 32px;
            font-size: 0.752em;
            color: #999999;
            span{
              display: inline-block;
              margin-left : 2px;
              color: #000000;
              font-size: 1.25em;
            }
          }
          .buy-number{
            font-size: 0.752em;
            color: #000000;
          }
        }
        &:last-child{
          border-bottom: none;
        }
      }
    }
    //order info end

    //ship type and pay type
    .type-box{
      padding: 0 3%;
      border-top: 1px solid #dddddd;
      border-bottom: 1px solid #dddddd;
      background-color: white;
      li{
        border-bottom: 1px solid #dddddd;
        &:last-child{
          border-bottom: none;
        }
        @import "checkBox";
        .check-group{
          overflow: hidden;
          //.regular-radio + label {
          //  float: left;
          //}
          label {
            float: left;
          }
        }
      }
    }
    .ship-type-box{
      li{
        padding-top: 16px;
        padding-bottom: 16px;
        .check-group{
          vertical-align: middle;
          span{
            display: inline-block;
            float: left;
            margin-left: 6px;
            margin-top : -1px;
            &.big-text{
              font-size: 1em;
            }
            &.normal-text{
              font-size: 0.4em;
            }
          }
        }
      }
    }
    //ship type end
    //pay type
    .pay-type-box{
      li{
        height: 58px;
        padding-top: 11px;
        padding-bottom: 9px;
        @extend %boxSizing;
        .check-group{
          label {
            top : 5px;
          }
          .pay-type-icon{
            width: 35px;
            margin-top : -2px;
            margin-left: 8px;
            margin-right: 10px;
            float: left;
          }
          .pay-type-info{
            float: left;
            .pay-type-name-box{
              font-size: 0.94em;
              overflow: hidden;
              .pay-type-name{
                float: left;
              }
              .pay-type-hot{
                float: left;
                width: 35px;
              }
            }
            .pay-type-desc{
              height: 14px;
              line-height: 14px;
              font-size: 0.752em;
              color: #666666;
              .left-amount{
                color: #f13b3b;
                font-size: 1.25em;
              }
            }
          }
        }
      }
    }
    //remark box
    .remark-box{
      position: relative;
      height: 58px;
      background-color: white;
      margin-bottom: 65px;
      .remark-info{
        position: absolute;
        top: 50%;
        left: 50%;
        width: 94%;
        margin-left: -47%;
        height: 40px;
        margin-top : -20px;
        font-size: 0.752em;
        color: #999999;
        border : none;
      }
    }
  }
  //footer
  .footer{
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 59px;
    line-height: 59px;
    background-color: white;
    border-top : 1px solid #dddddd;
    overflow: hidden;
    .footer-left{
      width: 76%;
      text-align: right;
      color: #666666;
      font-size: 0.752em;
      padding-right : 10px;
      float: left;
      @extend %boxSizing;
      .order-total-price{
        color: #f13b3b;
        font-size: 1.25em;
        letter-spacing: 1px;
      }
    }
    .footer-right{
      width: 24%;
      background-color: $mafu-darken-blue;
      text-align: center;
      font-size: 1.128em;
      color: white;
      cursor: pointer;
      float: right;
    }
  }

  //modal
  //@import "modal";
}